// 退货
import React, {useState, useEffect} from 'react';
import action from '../../store/actions/returnReview';
import {connect} from 'react-redux';
import {Pagination, message} from 'antd';
import {checkRefund} from '../../api';
import Header from './Header';
import ReturnReviewList from './ReturnReviewList';
import ViewDetails from './ViewDetails';

function ReturnReview(props) {
  const [text, useText] = useState('退货审核');
  const [visible, setVisible] = useState(false);
  useEffect(() => {
    props.GET_RETURN_REVIEW_LIST();
  }, []);

  // 通过审核按钮
  const throughAuditing = async (refund_no) => {
    checkRefund(refund_no).then(res => {
      props.GET_RETURN_REVIEW_LIST(props.current);
    }).catch(err => {
      console.log(err);
    });
  };

  // 查看详情
  const viewDetails = async (refund_no) => {
    props.VIEW_DETAILS(refund_no).then(res => {
      setVisible(true);
    }).catch(err => {
      console.log(err);
    });
  };

  // ok
  const handleOk = () => {
    setVisible(false);
  };
  // cancel
  const handleCancel = () => {
    setVisible(false);
  };

  // 分页改变
  const pageChange = page => {
    props.GET_RETURN_REVIEW_LIST(page);
  };

  return (
    <div className='returnReview'>
      <Header/>
      <ReturnReviewList
        returnReviewList={props.returnReviewList}
        throughAuditing={throughAuditing}
        viewDetails={viewDetails}
      />
      <Pagination
        current={props.current}
        onChange={pageChange}
        total={props.pageCount ? props.pageCount : 1}
        style={{textAlign: 'center', marginTop: '20px'}}
        pageSize={10}
        hideOnSinglePage
      />
      <ViewDetails visible={visible} data={props.viewDetailsData} handleOk={handleOk} handleCancel={handleCancel}/>
    </div>
  );
}

const mapStateToProps = state => state.returnReview;
export default connect(mapStateToProps, action)(ReturnReview);
